<template>
    <div>
        <hd-tab :tabs="tabs"></hd-tab>

        <el-card shadow="always" :body-style="{ padding: '10px' }">
            <div slot="header">
                幻灯片
            </div>
            <div class="card-body">
                <el-table
                    border
                    :data="form"
                    style="width: 100%">
                    <el-table-column
                        prop="id"
                        label="ID"
                        width="180">
                    </el-table-column>
                    <el-table-column
                        prop="title"
                        label="名称">
                    </el-table-column>
                    <el-table-column
                        #default="{row:sidershow}"
                        label="操作"
                    >
                        <el-button-group>
                            <el-button type="primary" size="mini" @click="router('admin.sidershow.edit', { id: sidershow.id })">编辑</el-button>
                            <el-button type="danger" size="mini" @click="Del(sidershow)">删除</el-button>
                        </el-button-group>
                    </el-table-column>
                </el-table>
            </div>
        </el-card>
    </div>
</template>

<script>
import tabs from './tabs'

export default {
    route: {name: 'admin.sidershow.index',meta:{title:'幻灯片列表'}},
    data() {
        return {
            form: [],
            tabs
        }
    },
    async created() {
        this.form = await this.axios.get(`admin/sidershow`);
    },
    methods: {
        async Del(sidershow) {
            this.$confirm(`确定删除【${sidershow.title}】?`, '温馨提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'error'
            }).then(async () => {
                await this.axios.delete(`admin/sidershow/${sidershow.id}`)
                this.form.splice(this.form.indexOf(sidershow), 1)
            })
        }
    }

}
</script>

<style scoped>

</style>
